<!-- 合同 -->
<template>
  <web-view v-if="show" :src="url" :update-title="false" :webview-styles="webviewStyles"></web-view>
  <view class="button-submit" v-if="showTab">
    <uni-row :gutter="20">
      <uni-col :span="24">
        <button type="primary" @click="doAgreed(true)">
          <texe>同意签名</texe>
          <texe v-if="time>0">（{{time}}秒)</texe>
        </button>
      </uni-col>
    </uni-row>
  </view>
  <cUserinfoSelect @setYhbh="doSelectYhbh" />
</template>

<script setup lang="ts">
  import cUserinfoSelect from "@/pages/bspsd/components/userinfo-select.vue";
  import { YhHtxxGet } from "@/api/request/YhHtxxGet";
  import { DzhtztSave } from "@/api/request/DzhtztSave";
  import { SysFiles } from "@/api/tables/SysFiles";
  import { ref, onBeforeUnmount, onMounted } from "vue"

  let show = ref(false)
  let url = ref('')
  let webviewStyles = ref({
    width: '100%',
    height: uni.getSystemInfoSync().windowHeight - 60 + 'px'
  })
  let timer = null
  const time = ref(0)

  let yhbhData = ref('')
  let dzhtztData = ref('')
  let showTab = ref(false)

  onBeforeUnmount(() => {
    closeTimer()
  })

  function doSelectYhbh(yhbh : string) {
    yhbhData.value = yhbh
    YhHtxxGet({
      data: { htxx: { yhbh } },
      success: (res) => {
        // dzhtzt //  2 4
        // 1 签订合同 2 续签 3 合同已签订 4 合同已续签
        dzhtztData.value = res.dzhtzt
        if (res.dzqm) {
          webviewStyles.value.height = uni.getSystemInfoSync().windowHeight + 'px'
          showTab.value = false
        } else {
          showTab.value = true
        }
        if (res.dzhtzt == 1 || res.dzhtzt == 2 || res.dzhtzt == 3 || res.dzhtzt == 4) {
          url.value = 'https://view.officeapps.live.com/op/embed.aspx?src=http://why761220.gnway.cc/psdmsfiles/filePreview/preview?fileId=' + res.pdfurl  //   'YxpPW7cT'
          show.value = true
          startTimer(10)
        } else {
          uni.showModal({
            title: '提示',
            content: '此户号暂无合同',
            showCancel: false,
            success: function () {
              uni.navigateBack()
            }
          })
        }
      },
      fail: (_code, message) => {
        uni.showModal({ content: message, showCancel: false })
        uni.navigateBack()
      }
    })
  }
  const doAgreed = function (value : boolean) {
    if (value) {
      if (time.value > 1) {
        uni.showToast({ icon: "none", title: "请先预读合同" })
        return
      } else {
        uni.navigateTo({
          url: "/pages/bspsd/components/signature?signatureTitle=合同签名",
          success: function (res) {
            uni.$once("dzqm", (res) => {
              addClick(res as SysFiles)
            })
          }
        })
      }
    } else {
      uni.navigateBack({
        delta: 1
      });
    }
  }
  // 开启定时器
  const startTimer = (currentTime : number) => {
    timer && clearInterval(timer)
    time.value = currentTime
    timer = setInterval(() => {
      time.value--
      if (time.value < 1) {
        timer && clearInterval(timer)
      }
    }, 1000)
  }
  // 关闭定时器 例如跳转页面，或者新的点击事件需要关闭定时器
  const closeTimer = () => {
    timer && clearInterval(timer)
    timer = null;
  }
  // 组件挂载完成后执行的函数
  // onMounted(()=>{

  // })
  const addClick = function (dzqmdata : SysFiles) {
    if (dzqmdata.fileId && yhbhData.value) {
      DzhtztSave({
        data: { htxx: { dzqm: dzqmdata.fileId, yhbh: yhbhData.value, dzhtzt: dzhtztData.value } },
        success: (res) => {
          if (dzqmdata.fileId) {
            webviewStyles.value.height = uni.getSystemInfoSync().windowHeight - 60 + 'px'
            showTab.value = false
          } else {
            showTab.value = true
          }
          uni.showModal({
            title: '提示',
            content: '签名成功',
            showCancel: false,
            success: function () {
              uni.navigateBack()
            }
          })
        },
      })
    }

  }
</script>

<style lang="scss" scoped>

</style>